<!DOCTYPE html	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" xmlns:s="http://sduept.security.el/func"
	template="/template/template_dialog.xhtml">
	<ui:define name="head">
		<link href="/css/primefaces/menubase.css" rel="stylesheet" type="text/css" />
		<title>新建互查计划</title>
		<style type="text/css">
			/* .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
			    border: 1px solid #999;
			} */
			/* .ui-datatable-scrollable-header-box {
				margin-right:0px !important;
			} */
			.ui-selectonemenu .ui-selectonemenu-trigger, .ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger {
			    border-color: #fff !important;
			}
			.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
			    border: 1px solid #999;
			}
			.ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
			    border: 1px solid #156090;
			    background: #3c8dbc;
			    color: #555;
			}
			.ui-state-highlight .ui-icon {
			    background-image: url(/javax.faces.resource/images/ui-icons_454545_256x240.png.xhtml?ln=primefaces-omega);
			}
			.ui-autocomplete .ui-autocomplete-dropdown {
			    position: absolute;
			    height: 100%;
			    width: 17px;
			    right: -2px;
			    background: #3c8dbc !important;
			}
			.ui-autocomplete-input.ui-autocomplete-dd-input {
			    padding-right: 1.4em;
			}
			.ui-widget-header .ui-state-default {
			    border: 1px solid #d6d6d6;
			    background: #fff;
			    font-weight: bold;
			    color: #222;
			}
		</style>
		<script>
			$(function() {
				setHeight();
				var sc = document.getElementsByClassName("ui-datatable-scrollable-body")[0];
				/* alert(sc.scrollHeight);
				alert(sc.clientHeight); */
				if(sc.clientHeight >= sc.scrollHeight) {
					$('.ui-datatable-scrollable-header').attr('style','padding-right:15px!important');
				}				
			})
			function setHeight() {
				var height = $(window).height();
				var dtHeight = height-130;
				$('.ui-datatable-scrollable-body').attr('style','height:'+dtHeight+'px');
				document.getElementsByClassName("ui-datatable-scrollable-body")[0].style.overflowY = "scroll";
			}
			//当需要更新datatable时记录滚动条的位置
			var scrollTop;
			function onUpdateStart() {
				scrollTop = $(".ui-datatable-scrollable-body").scrollTop();
			}
			function onUpdateComplete() {
				setHeight();
				//设置滚动条位置
				if(scrollTop) {
					$(".ui-datatable-scrollable-body").animate({scrollTop:scrollTop},0);
				}
			}
			/*设置datatable的row背景颜色*/
			function setRowBgColor(index,color) {
				$(".ui-datatable-scrollable-body>table>tbody>tr[data-ri='"+index+"']").attr("style","background-color:"+color);
			}
			/*打开设置互查项弹窗*/
			var inspectionOtherItemIndex;
			function openSetInspectOtherItemDialog() {
				inspectionOtherItemIndex = layer.open({
					type : 2,
					area : [ '60%', '80%' ],
					fixed : false, //不固定
					title : '添加互查项',
					maxmin : true,
					content : "/ui/equipmentAssessment/assessmentplan/dialog/setInspectOtherItemDialog.xhtml",
				});
			}
			/*打开组织机构人员选择器*/
			var userDialogIndex;
			function openUserChooseDialog() {
				userDialogIndex = layer.open({
					type : 2,
					maxmin : false,
					area : [ '420px', '90%' ],
					fixed : false,
					title : '人员选择器',
					content : '/ui/common/org_selector_user_single_layer.xhtml'
				});
			}
			function dialogReturn(index, data) {
				var params = [];
				data = eval("(" + data + ")");
				if (index == inspectionOtherItemIndex) {
					params.push({
						name : 'inspectionScope',
						value : data.inspectionScope
					},{
						name: 'acceptUnits',
						value: data.acceptUnits
					});
					onSetInspectOtherItemDialogReturn(params);

				}
				if (index == userDialogIndex) {
					params.push({
						name : 'className',
						value : data.className
					}, {
						name : 'userJson',
						value : data.data
					});
					onUserDialogReturn(params);
				}
			}
			/*关闭该弹窗并返回数据*/
			function closeAndSave(data) {
				//将对象转为JSON字符串
				data = JSON.stringify(data);
				var index = parent.layer.getFrameIndex(window.name);
				if (parent.dialogReturn) {
					parent.dialogReturn(index, data);
				}
				parent.layer.close(index);
			}
		</script>
	</ui:define>
 	
	<ui:define name="content">
	  <h:form id="basicForm">
	  	<p:growl id="msgs" showDetail="true" />
		<p:confirmDialog global="true" showEffect="fade" hideEffect="fade">
				<p:commandButton value="是" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
				<p:commandButton value="否" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
			</p:confirmDialog>
		<p:panelGrid cellpadding="5" style="width:100%;border-bottom: 1px solid #999;">
			<p:row>
            	<p:column>
            		<p:outputLabel value="评价名称*："></p:outputLabel>
            	</p:column>
            	<p:column>
            		<p:inputText id="planName" value="#{addInspectOtherPlanController.targetPlan.name}" style="width:100%">					
					 	<p:ajax event="keyup" />
					 </p:inputText>
            	</p:column>
            	<p:column>
            		<p:outputLabel value="评价时间："></p:outputLabel>
            	</p:column>
            	<p:column>
					 <p:calendar id="startTime"
						value="#{addInspectOtherPlanController.targetPlan.startTime}"
						pattern="yyyy-MM-dd" >
						<p:ajax event="dateSelect" />
					</p:calendar>至<p:calendar id="endTime"
						value="#{addInspectOtherPlanController.targetPlan.endTime}"
						pattern="yyyy-MM-dd">
						<p:ajax event="dateSelect" />
					</p:calendar> 
				</p:column>  
                <p:column>
                	<p:outputLabel value="负责人*："></p:outputLabel>
                </p:column>
                <p:column>
					<h:inputText id="responsible" value="#{addInspectOtherPlanController.targetPlan.responsible}" />
					<p:commandButton value="选择" icon="ui-icon-extlink" style="font-size:12px" onclick="openUserChooseDialog()"/>
					<p:remoteCommand name="onUserDialogReturn" update=":basicForm:responsible :basicForm:responsiblePhone" 
							actionListener="#{addInspectOtherPlanController.onUserDialogReturn}" />
				</p:column>
                <p:column>
                	<p:outputLabel value="负责人联系方式*：" />
                </p:column>
                <p:column>
					<h:inputText id="responsiblePhone" value="#{addInspectOtherPlanController.targetPlan.responsiblePhone}" />
				</p:column>
				<p:column style="background: -webkit-linear-gradient(top,#f6f7f9 0,#ebedf0 100%);text-align: center;">
					<p:commandButton style="font-size:14px" icon="fa fa-floppy-o" value="保存草稿" 
						actionListener="#{addInspectOtherPlanController.saveAssessmentPlan()}" >
						<!-- <p:confirm header="提示" message="确定保存草稿吗?" icon="ui-icon-alert" /> -->
					</p:commandButton>
				</p:column>
            </p:row>
		</p:panelGrid>
	</h:form>
	<h:form id="inspectOtherTreeForm">
		<p:toolbar id="treeBtn">
			<f:facet name="left">
				<p:commandButton style="font-size:14px" icon="fa fa-floppy-o" value="添加互查项"
					onclick="openSetInspectOtherItemDialog()" >
				</p:commandButton>	
				<p:remoteCommand name="onSetInspectOtherItemDialogReturn" update="inspectOtherInfo"
				 	actionListener="#{addInspectOtherPlanController.onSetInspectOtherItemDialogReturn()}" oncomplete="setHeight()"/>
				 <p:commandButton style="font-size:14px" icon="fa fa-trash-o" value="删除" 
				 	disabled="#{addInspectOtherPlanController.disabledDelBtn()}" 
				 	actionListener="#{addInspectOtherPlanController.deleteSelectedNodes()}" 
				 	update="inspectOtherInfo treeBtn" onstart="onUpdateStart()" oncomplete="onUpdateComplete()">
				 	<p:confirm header="提示" message="确定删除这 #{addInspectOtherPlanController.selectedModels.size()} 项吗？" icon="ui-icon-alert" />
				</p:commandButton>	
				<p:commandButton value="新增专家" icon="ui-icon-plus" oncomplete="PF('treeDialog').show()" actionListener="#{expertController.addExpert}" update="editForm:tree"/>	
			</f:facet>
		</p:toolbar>
	</h:form>
		<s:dataTable id="inspectOtherInfo" value="#{addInspectOtherPlanController.inspectOtherModels}" rowIndexVar="ite"    
			var="item" emptyMessage="无记录" style="text-align:center;" scrollable="true" scrollHeight="0" >
			<s:column groupRow="true" headerText="专家派出分子公司" >
				<h:outputText value="#{item.inspectionScope}" />&nbsp;
				<h:outputText value="( #{addInspectOtherPlanController.getAcceptUnitNumFromInspectionScope(item.inspectionScope)} )" />
			</s:column>
			<s:column groupRow="true" headerText="被检分子公司">
				<h:outputText value="#{item.acceptScope}" />&nbsp;
				<h:outputText value="( #{addInspectOtherPlanController.getAcceptUnitNumFromAcceptScope(item.inspectionScope,item.acceptScope)} )" />
			</s:column>
			<s:column headerText="被检单位">
				<h:outputText value="#{item.acceptUnit}" />
			</s:column>
			<s:column headerText="被检单位迎检联系人" style="width:250px">
				<h:form>
					<p:panelGrid cellpadding="5" style="width:100%;border:0;">
						<p:row style="border:0px;padding:0px">
							<p:column style="border:0px;padding:2px;">
								<h:outputLabel value="姓名："></h:outputLabel>
							</p:column>
							<p:column style="border:0px;padding:2px;">
								<p:autoComplete id="stationPersonnel" value="#{item.stationPersonnel}" scrollHeight="200"
									completeMethod="#{addInspectOtherPlanController.completeStationPersonnels}" dropdown="true" inputStyle="width:100%">
									<f:attribute name="model" value="#{item}"></f:attribute>
									<p:ajax event="itemSelect" listener="#{addInspectOtherPlanController.onStationPersonnelSelect(item)}" update="@form"></p:ajax>
									<p:ajax event="keyup"></p:ajax>
								</p:autoComplete>
							</p:column>
						</p:row>
						<p:row style="border:0px;padding:0px">
							<p:column style="border:0px;padding:2px">
								<h:outputLabel value="电话："></h:outputLabel>
							</p:column>
							<p:column style="border:0px;padding:2px">
								<p:inputText id="stationPersonnelPhone" value="#{item.stationPersonnelPhone}" style="width:100%">					
								 	<p:ajax event="keyup" />
								 </p:inputText>
							</p:column>
						</p:row>
					</p:panelGrid>
					
				</h:form>
			</s:column>
			<!-- <s:column headerText="被检单位迎检联系人电话">
				<h:form>
					<p:inputText id="stationPersonnelPhone" value="#{item.stationPersonnelPhone}" style="width:100%">					
					 	<p:ajax event="keyup" />
					 </p:inputText>
				</h:form>
			</s:column> -->
			<s:column headerText="派出专家分子公司联系人" style="width:250px">
				<h:form>
					<p:panelGrid cellpadding="5" style="width:100%;border:0;">
						<p:row style="border:0px;padding:0px">
							<p:column style="border:0px;padding:2px;">
								<h:outputLabel value="姓名："></h:outputLabel>
							</p:column>
							<p:column style="border:0px;padding:2px;">
								<p:autoComplete id="inspectionScopePersonnel" value="#{item.inspectionScopePersonnel}" scrollHeight="200"
									completeMethod="#{addInspectOtherPlanController.completeInspectionScopePersonnels}" dropdown="true" inputStyle="width:100%">
									<f:attribute name="model" value="#{item}"></f:attribute>
									<p:ajax event="itemSelect" listener="#{addInspectOtherPlanController.onInspectionScopePersonnelSelect(item)}" update="@form"></p:ajax>
									<p:ajax event="keyup"></p:ajax>
								</p:autoComplete>
							</p:column>
						</p:row>
						<p:row style="border:0px;padding:0px">
							<p:column style="border:0px;padding:2px">
								<h:outputLabel value="电话："></h:outputLabel>
							</p:column>
							<p:column style="border:0px;padding:2px">
								<p:inputText id="inspectionScopePersonnelPhone" value="#{item.inspectionScopePersonnelPhone}" style="width:100%">					
								 	<p:ajax event="keyup" />
								 </p:inputText>
							</p:column>
						</p:row>
					</p:panelGrid>
				</h:form>
			</s:column>
			<!-- <s:column headerText="派出专家分子公司联系人电话">
				<h:form>
					<p:inputText id="inspectionScopePersonnelPhone" value="#{item.inspectionScopePersonnelPhone}" style="width:100%">					
					 	<p:ajax event="keyup" />
					 </p:inputText>
				</h:form>
			</s:column> -->
			<s:column headerText="组别" style="width:50px">
				<h:form>
					<p:inputText id="inspectionExpertGroup"
						value="#{item.inspectionExpertGroup}" style="width:95%">
						<p:ajax event="blur" listener="#{addInspectOtherPlanController.onInspectionExpertGroupBlur(item)}" update="basicForm:msgs @form"/>
					</p:inputText>
				</h:form>
			</s:column>
			<s:column headerText="派出专家名称" style="width:250px">
				<h:form id="inspectionExpertForm">
					<p:panelGrid cellpadding="5" style="width:100%;border:0;">
						<p:row style="border:0px;padding:0px">
							<p:column style="border:0px;padding:2px;">
								<h:outputLabel value="姓名："></h:outputLabel>
							</p:column>
							<p:column style="border:0px;padding:2px;">
								<p:autoComplete id="inspectionExpert" value="#{item.inspectionExpert}" scrollHeight="200"
									completeMethod="#{addInspectOtherPlanController.completeInspectionExperts}" dropdown="true" inputStyle="width:100%">
									<f:attribute name="model" value="#{item}"></f:attribute>
									<p:ajax event="itemSelect" listener="#{addInspectOtherPlanController.onInspectionExpertSelect(item)}" update="@form"></p:ajax>
									<p:ajax event="keyup" oncomplete="setHeight()"></p:ajax>
									<p:ajax event="blur" listener="#{addInspectOtherPlanController.onInspectionExpertBlur(item)}" 
										oncomplete="setHeight()" update="basicForm:msgs" />
								</p:autoComplete>
							</p:column>
						</p:row>
						<p:row style="border:0px;padding:0px">
							<p:column style="border:0px;padding:2px">
								<h:outputLabel value="电话："></h:outputLabel>
							</p:column>
							<p:column style="border:0px;padding:2px">
								<p:inputText id="inspectionExpertPhone" value="#{item.inspectionExpertPhone}" style="width:100%">					
								 	<p:ajax event="keyup" />
								 </p:inputText>
							</p:column>
						</p:row>
					</p:panelGrid>
				</h:form>
			</s:column>
			<s:column headerText="派出专家供电局名称" style="width:100px">
				<h:form>
					<p:autoComplete id="inspectionUnit" value="#{item.inspectionUnit}" scrollHeight="200"
						completeMethod="#{addInspectOtherPlanController.completeInspectionUnits}" dropdown="true" inputStyle="width:100%">
						<f:attribute name="model" value="#{item}"></f:attribute>
						<p:ajax event="itemSelect" oncomplete="setHeight()"></p:ajax>
						<p:ajax event="keyup"></p:ajax>
						<!-- <p:ajax event="blur" listener="#{addInspectOtherPlanController.onInspectionUnitBlur(item)}" 
							oncomplete="setHeight()" update="basicForm:msgs inspectOtherInfo"></p:ajax> -->
					</p:autoComplete>
				</h:form>
			</s:column>
			<!-- <s:column headerText="派出专家联系电话">
				<h:form id="inspectionExpertPhoneForm">
					<p:inputText id="inspectionExpertPhone" value="#{item.inspectionExpertPhone}" style="width:100%">					
					 	<p:ajax event="keyup" />
					 </p:inputText>
				</h:form>
			</s:column> -->
			<s:column>
				<h:form>
					<p:commandLink style="font-size:18px" class="fa fa-square-o" rendered="#{!item.selected}" 
						actionListener="#{addInspectOtherPlanController.setModelSelected(item)}" 
						update="@form inspectOtherTreeForm:treeBtn" onstart="onUpdateStart()" oncomplete="onUpdateComplete()" />
					<p:commandLink style="font-size:18px" class="fa fa-check-square-o" rendered="#{item.selected}" 
						actionListener="#{addInspectOtherPlanController.setModelUnSelected(item)}" 
						update="@form inspectOtherTreeForm:treeBtn" onstart="onUpdateStart()" oncomplete="onUpdateComplete()" />
				</h:form>
			</s:column>
		</s:dataTable>
		
		
	<h:form id="editForm">
		<p:growl id="mess" showDetail="true"></p:growl>
		<p:dialog id ="treeDialog" widgetVar="treeDialog" width="500" height="550" modal="true"  header="新增专家" >
			<p:toolbar id="toolbar">
				<f:facet name="left">
					<p:autoComplete placeholder="输入人员首字母可查" id="orgPerson" size="18"
						value="#{expertController.personName}" completeMethod="#{expertController.completePersons}"
						scrollHeight="400" style="float:left;margin-top:5px;" dropdown="true" >
						<p:ajax event="itemSelect" update=":editForm:tree :editForm:toolbar" listener="#{expertController.autoCompleteOrgTree}" />
					</p:autoComplete>
					<p:commandButton icon="fa fa-refresh" style="margin-left:5px;margin-top:5px;" value="重置"
						actionListener="#{expertController.refresh}" update=":editForm:tree :editForm:toolbar" />
					<p:commandButton style="margin-left:5px;margin-top:5px;" value="继续选择" 
						update=":editForm:tree :editForm:toolbar" actionListener="#{expertController.addChoice}"
						rendered="#{expertController.choiceStatus}" />
				</f:facet>
				<f:facet name="right">
					<p:commandButton value="设为专家" style="margin-right:10px;margin-top:5px;" id="okBtn"
						actionListener="#{expertController.addExperts}" update="mess" oncomplete="PF('treeDialog').hide()"
				     	disabled="#{expertController.checkboxPersons.size() == 0}" >
				    	<f:actionListener binding="#{addInspectOtherPlanController.setExpert()}"></f:actionListener> 	
				    </p:commandButton>
				</f:facet>
			</p:toolbar>
			<p:tree value="#{expertController.root}" var="node" id="tree" style="border:0" dynamic="true" 
				selectionMode="checkbox" animate="true" >
				<p:ajax event="expand" update="tree" listener="#{expertController.onNodeExpand}" />	
				<p:ajax event="select" listener="#{expertController.onNodeSelect}" update=":editForm:toolbar "/>
				<p:ajax event="unselect" listener="#{expertController.onNodeUnSelect}" update=":editForm:toolbar" />
				<p:treeNode type="dept" icon="fa fa-home">
					<h:outputText value="#{node}" />
				</p:treeNode>
				<p:treeNode type="personnel" icon="fa fa-user">
					<h:outputText value="#{node}" />
				</p:treeNode>
			</p:tree>
		</p:dialog>
	</h:form>

	</ui:define>
</ui:composition>